<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>补单</title>
    <link th:replace="/comm/header :: header"/>
    <script type="text/javascript">
        $(function () {   //第二步,编写js代码,在页面加载完成后开始自定义校验
            $.extend($.fn.validatebox.defaults.rules, {
                telephone: {    //第三步,选中校验谁
                    validator: function (value) {    //第四步, 具体编写校验规则
                        var reg = /^1[3,5,7,8][0-9]{9}$/;
                        return reg.test(value);

                    },
                    message: '请输入正确的手机号!'   //第五步,如果输入内容不符合校验规则,出现的提示语.
                }
            });
            $("#dg").datagrid({
                onLoadSuccess: function (data) {
                    $('.role-easyui-linkbutton-edit').linkbutton({text: '签单', plain: true, iconCls: 'fa fa-pencil'});
                    $('.role-easyui-linkbutton-del').linkbutton({text: '废弃', plain: true, iconCls: 'fa fa-trash-o'});
                    $('#dg').datagrid('fixRowHeight');
                }
            });
        });

        function rowStyler(index, row) {
            if (row.sex == 1) {
                return 'background-color:#6293BB;color:#fff;'; // return inline style
            } else {
                return 'color:green;';
            }
        }

        function closeUserDialog() {
            $("#dlg").dialog("close");
            $('#fm').form('clear');
            $('#rb').radiobutton({
                checked: true
            });

        }

        function saveUser() {
            $("#fm").form("submit", {
                url: "/pro/waybill/save",
                onSubmit: function () {
                    return $(this).form("validate");
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.flag) {
                        message("补单成功");
                        $('#fm').form('clear');
                        $("#dg").datagrid("reload");
                        $("#dlg").dialog("close");
                    } else {
                        message(result.message)
                    }
                }
            });
        }

        function openUserAddDialog() {
            $("#dlg").dialog("open").dialog("setTitle", "添加用户信息");
        }

        function uploadidalogonline(flag) {
            $('#uploadonlineinfo').dialog('open').dialog('setTitle', '文件上传');
            $("#flag").val(flag);
        }

        function uploadonline() {
            var file = $("#file")[0].files[0];
            var flag = $("#flag").val();
            var url;
            if (file.name == "") {
                alert("请先选择文件");
                return false;
            }
            if (flag == 1) {
                url = "/image/upload";
                if (!file.name.match(/.jpg|.jpeg|.gif|.png|.bmp/i)) {
                    alert("文件格式错误");
                    return false;
                }
            } else {
                url = "/excelImport";
                if (!file.name.match(/.xls|.xlsx/i)) {
                    alert("文件格式错误");
                    return false;
                }
            }
            var form = new FormData();
            form.append("file", file);
            $.ajax({
                url: url,
                type: "post",
                data: form,
                processData: false,
                contentType: false,
                success: function (result) {
                    $('#uploadonlineinfo').window('close');
                    if (result.total > 0) {
                        message("上传成功!有条" + result.total + "数据插入失败，请检查数据的准确性");
                        $('#dg').datagrid({
                            data: result.rows
                        });
                    } else {
                        message("全部上传成功!");
                    }
                },
                error: function (e) {
                    console.log(e);
                }
            });

        }
    </script>
</head>
<body style="margin: 1px">
<div id="tb">
    <shiro:hasPermission name="sys:user:add">
        <div style="display: inline-block;">
            <a href="javascript:openUserAddDialog()" class="easyui-linkbutton primary" iconCls="fa fa-plus"
               plain="true">添加</a>
        </div>
    </shiro:hasPermission>
    <shiro:hasPermission name="sys:user:add">
        <div style="display: inline-block;">
            <td><a href="javascript:uploadidalogonline(2)">上传Excel</a></td>
        </div>
    </shiro:hasPermission>
</div>


<table id="dg" title="错误数据" class="easyui-datagrid"
       fitColumns="true" pagination="true" rownumbers="true" singleSelect="true" method="get" fit="true" toolbar="#tb">
    <thead>
    <th field="idcard" width="50" align="center">车牌号</th>
    <th field="stime" width="50" align="center">开始时间</th>
    <th field="etime" width="50" align="center">结束时间</th>
<!--    <th field="aa" width="200" align="center" formatter="formatOp">操作</th>-->
    </thead>
</table>



<div id="dlg" class="easyui-dialog" style="width: 450px;height: 400px;padding: 10px 20px"
     closed="true" buttons="#dlg-buttons">
    <form id="fm" method="post">
        <table cellspacing="8px">
            <tr>
                <td>车牌号：</td>
                <td>
                    <input type="text" id="idcard" name="idcard" class="easyui-validatebox easyui-textbox"
                           style="height: 35px;width: 200px" required="true"/>
                </td>
            </tr>
            <tr>
                <td>开始时间：</td>
                <td>
                    <input class="easyui-datetimebox" name="stime"
                           data-options="required:true,showSeconds:false" style="width:150px">
                </td>
            </tr>
            <tr>
                <td>结束时间：</td>
                <td>
                    <input class="easyui-datetimebox" name="etime"
                           data-options="required:true,showSeconds:false" style="width:150px">
                </td>
            </tr>
        </table>
    </form>
</div>

<div id="uploadonlineinfo" class="easyui-dialog" style="width:380px;padding:10px 40px" closed="true">
    <form id="fam" method="post" enctype="multipart/form-data">
        <input type="file" id="file" name="file">
        <input type="hidden" id="flag" name="flag">
    </form>

    <div data-options="region:'south',border:false" style="text-align:center;padding:5px 0 0;">
        <a class="easyui-linkbutton" data-options="iconCls:'icon-ok'" href="javascript:void(0)"
           onclick="uploadonline();" style="width:80px">上传</a>
    </div>
</div>

<div id="dlg-buttons">
    <a href="javascript:saveUser()" class="easyui-linkbutton" iconCls="fa fa-check">保存</a>
    <a href="javascript:closeUserDialog()" class="easyui-linkbutton" iconCls="fa fa-times">关闭</a>
</div>

</body>
</html>